<template>
  <div class="app-container">

    <el-form ref="form" v-loading="isloading" :model="form" :rules="rules" label-position="right" label-width="200px">
      <div class="title">
        智能推荐
      </div>
      <div class="content">
        特惠推荐：
        <el-switch v-model="form.tehuituijian" :inactive-value="0" :active-value="1" active-color="#13ce66" inactive-color="#aaa">
        </el-switch>
        &nbsp; &nbsp; 新品推荐:
        <el-switch v-model="form.xinpintuijian" :inactive-value="0" :active-value="1" active-color="#13ce66" inactive-color="#aaa">
        </el-switch>
      </div>
      <div class="title">
        支付方式
      </div>
      <div class="content">
        含积分：
        <el-switch v-model="form.haspoints" :inactive-value="0" :active-value="1" active-color="#13ce66" inactive-color="#aaa">
        </el-switch>
        &nbsp; &nbsp; 含微信:
        <el-switch v-model="form.hasweixin" :inactive-value="0" :active-value="1" active-color="#13ce66" inactive-color="#aaa">
        </el-switch>
        &nbsp; &nbsp; 含电子券:
        <el-switch v-model="form.hasdianziquan" :inactive-value="0" :active-value="1" active-color="#13ce66" inactive-color="#aaa">
        </el-switch>
      </div>
      <div class="title">
        商品类别
      </div>
      <div class="content">
        <template v-for="category in goods_categories">
          {{category.text}}：
          <el-switch :key="category.value" v-model="form.categories[category.value]" :inactive-value="0" :active-value="1" active-color="#13ce66"
            inactive-color="#aaa">
          </el-switch>
          &nbsp; &nbsp;
        </template>

      </div>
      <div class="title">
        品牌选择
      </div>
      <div class="content">
        <template v-for="category in goods_brands">
          {{category.text}}：
          <el-switch :key="category.value" v-model="form.brands[category.value]" :inactive-value="0" :active-value="1" active-color="#13ce66"
            inactive-color="#aaa">
          </el-switch>
          &nbsp; &nbsp;
        </template>
      </div>
      <div class="btns">
 <el-button type="primary" :loading="isSubmiting"  @click="doSubmit">保存提交</el-button>
    </div>
    </el-form>
  </div>
</template>
<script>
export default {
  data() {
    return {
      goods_categories: [],
      goods_brands: [],
      isSubmiting: false,
      isloading: true,
      form: {
        categories: {},
        brands: {}
      },
      rules: {
        flashsale_paytime: {
          required: true,
          message: ""
        },
        orderCloseTime: {
          required: true,
          message: ""
        },
        receiveCloseTime: {
          required: true,
          message: ""
        },
        orderFinishTime: {
          required: true,
          message: ""
        },
        smsWhenSend: {
          required: true,
          message: ""
        },
        provideInvoice: {
          required: true,
          message: ""
        }
      }
    };
  },
  created() {
    this.combOptions("goods_category").then(info => {
      this.goods_categories = info;
    });
    this.combOptions("goods_brand").then(info => {
      this.goods_brands = info;
      // this.isloading = false;
    });
    let inArray = (el, arr) => {
      return arr.some(c => {
       return c.value == el;
      });
    };
    this.$post("/admin/sys_config/get_goods_sort_settings")
      .then(data => {
        let categories = {};
        if (data.categories) {
          let cids = data.categories.split(",");
          for (let i = 0; i < cids.length; i++) {
            if (inArray(cids[i], this.goods_categories)) {
              categories[cids[i]] = 1;
            }
          }
        }
        data.categories = categories;

        let brands = {};
        if (data.brands) {
          let cids = data.brands.split(",");
          for (let i = 0; i < cids.length; i++) {
            if (inArray(cids[i], this.goods_brands)) {
              brands[cids[i]] = 1;
            }
          }
        }
        data.brands = brands;
        this.form = data;
        this.isloading = false;
      })
      .catch(_ => {
        this.isloading = false;
      });
  },
  methods: {
    doSubmit() {
      this.isSubmiting = true;
      let postData = Object.assign({}, this.form);
      let categories = [];
      for (let key in postData.categories) {
        if (postData.categories[key] == 1) {
          categories.push(key);
        }
      }
      let brands = [];
      console.log(postData.brands);
      for (let key in postData.brands) {
        if (postData.brands[key] == 1) {
          brands.push(key);
        }
      }
      postData.categories = categories.join(",");
      postData.brands = brands.join(",");
      this.$post("/admin/sys_config/save_goods_sort_settings", postData)
        .then(_ => {
          this.isSubmiting = false;
          this.$$notify();
        })
        .catch(_ => {
          this.isSubmiting = false;
        });
    }
  }
};
</script>

<style lang="scss" scoped>
.title {
  padding: 20px 0 20px 10px;
  border-bottom: 1px solid #eee;
  margin-bottom: 30px;
}

.content {
  font-size: 14px;
  padding: 10px 20px 30px 20px;
}

.btns {
  padding-left: 160px;
  padding-top: 40px;
}
</style>
